﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>javascript图片切换旋转滑动效果 Lightweight Circle slideshow 网页设计爱好者www.html.org.cn整理</title>
	<link rel="stylesheet" href="css/website.css" type="text/css" media="screen"/>

	<!--[if lte IE 6]>
		<style type="text/css">
		/* Internet Explorer 6 PNG transparency fix */
		#rotatescroll .overlay { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bg-rotatescroll.png", sizingmethod='scale'); }
		#rotatescroll .thumb { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bg-thumb.png", sizingmethod='scale'); }
		</style>
	<![endif]-->
	
	<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="js/jquery.tinycircleslider.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$('#rotatescroll').tinycircleslider({ interval: true, snaptodots: true });
		});
	</script>	
</head>
<body>




<br/>
更多js特效请访问：
<a href="http://www.html.org.cn/">网页设计爱好者 http://www.html.org.cn </a>



	<div id="rotatescroll">
		<div class="viewport">
			<ul class="overview">
				<li><a href="http://www.htmldrive.net"><img src="http://www.htmldrive.net/images/photos/img1_m.jpg" /></a></li>
				<li><a href="http://www.htmldrive.net"><img src="http://www.htmldrive.net/images/photos/img2_m.jpg" /></a></li>
				<li><a href="http://www.htmldrive.net"><img src="http://www.htmldrive.net/images/photos/img6_m.jpg" /></a></li>
				<li><a href="http://www.htmldrive.net"><img src="http://www.htmldrive.net/images/photos/img9_m.jpg" /></a></li>
				<li><a href="http://www.htmldrive.net"><img src="http://www.htmldrive.net/images/photos/img10_m.jpg" /></a></li>															
			</ul>
		</div>
		
		<div class="dot"></div>
		<div class="overlay"></div>
		<div class="thumb"></div>
	</div>
</body>
</html>
